<template>
	<div class="footer">
		<div class="ftwrap">
			<div class="logo">
			<footlogosvg class="logosvg"></footlogosvg>	
			</div>
			<div class="openapp">打开APP，发现更多好音乐 &gt;</div>
			<p class="copyright">网易公司版权所有©1997-2018 杭州乐读科技有限公司运营</p>
		</div>
	</div>
</template>

<script>
	import footlogosvg from '@/svg/foot-logo.svg'
	export default {
		components: {
		   footlogosvg
		}
	}
</script>

<style lang="scss" scoped>
	@charset "utf-8";
		$fs:64px;
		html {
			font-size: $fs;
		}
		
		@function r($px) {
			@return $px/$fs*1rem;
		}
	.footer /deep/ .logosvg {
				    display: block;
				    margin: 0 auto;
				    width: r(460px);
				    height: r(88px);
				}
	.footer{
		position: relative;
		width: 100%;
		height: 0;
	    padding-top: 53.3%;
	    margin-top: r(8px);
	    background: url(https://s3.music.126.net/m/s/img/recommand_bg_2x.png?d045fafc60e017b653f8065a87496922) no-repeat;
	    background-size: contain;
	    .ftwrap{
			    position: absolute;
			    left: 0;
			    right: 0;
			    bottom: 0;
			    top: 0;
			    z-index: 1;
			    text-align: center;
			    .logo {
				    padding-top: 12%;
				}
				.openapp{
				    line-height: r(76px);
				    border: r(2px) solid #d33a31;
				    border-radius: r(76px);
				    font-size: r(32px);
				    color: #d33a31;
				    margin: r(30px) r(74px) r(10px);
				}
				.copyright{
				    color: #888;
				    font-size: r(24px);
				    line-height: r(32px);
				    -webkit-transform: scale(.75);
				    transform: scale(.75);
				}
			}
	}	
</style>